<template>
	<div class="carBox">
		<!-- <el-steps :active="active" finish-status="success" :align-center="true" class="steps">
			<el-step title="1.我的购物车" />
			<el-step title="2.填写核对订单信息" />
			<el-step title="3.成功提交订单" />
		</el-steps> -->

		<div class="steps">
			<div class="step-item" :class="active >= 0 ? 'active' : ''">
				<span class="line" />
				<span class="number step1">1</span>
				<span class="line" />
			</div>
			<div class="step-item" :class="active >= 1 ? 'active' : ''">
				<span class="line" />
				<span class="number step2">2</span>
				<span class="line" />
			</div>
			<div class="step-item" :class="active >= 2 ? 'active' : ''">
				<span class="line" />
				<span class="number step3">3</span>
				<span class="line" />
			</div>
		</div>
		<div class="coupons-box">
			<el-collapse v-model="activeNames" class="collapse-clas">
				<el-collapse-item name="1">
					<template slot="title">
						<img src="@/assets/img/cartioc_03.png" class="imicon">
						购物车可领取优惠券
					</template>
					<div class="cart-gwq-box">
						<!-- v-if="Overdue(item.exp_date)  && item.receive_by_other !== 0" -->
						<div v-for="(item, index) in ActionArr" v-if="Overdue(item.exp_date)" :key="index"
							class="cart-gwq-item" @click="ToReceive(item)">
							<div class="cart-lis">
								<div class="text_box">
									<div class="tip">
										{{ item.title }}
									</div>
									<div class="data_box">
										{{ item.effect_date | rawData }}至{{
                      item.exp_date | rawData
                    }}
									</div>
								</div>
								<div class="title_box">
									<div class="title_right">
										领取
									</div>
								</div>
							</div>
						</div>
					</div>
				</el-collapse-item>
			</el-collapse>
		</div>
		<div v-if="active == 1" class="addressInfo">
			<div class="initAddress">
				<img src="../../assets/img/local.png" alt="">
				<span>默认地址</span>
				<span class="edit">修改信息</span>
			</div>
			<div class="ads">
				<div class="addinfos">
					<div>收货人：刘小明</div>
					<div>联系方式：139****8789</div>
					<div>收货地址：中国云南省昆明市xxx区xxx街123号</div>
				</div>
				<div class="btns">
					<div class="toggleAd">
						地址切换
					</div>
					<div class="addAd">
						新增地址
					</div>
				</div>
			</div>
		</div>
		<div class="tableTitle">
			<div style="width: 6rem">
				选择
			</div>
			<div style="width: 10rem">
				商品图片
			</div>
			<div style="width: 24rem">
				商品信息
			</div>
			<div style="width: 10rem">
				规格
			</div>
			<div style="width: 14rem">
				数量
			</div>
			<div style="width: 10rem">
				单价
			</div>
			<div style="width: 12rem">
				操作
			</div>
		</div>
		<div class="carList">
			<!-- <div class="toper">
				<div class="btns">
					全场加购价
				</div>
				<div>再购22.00元立享【满100元可超值换购】</div>
				<div class="btns2">
					查看换购
				</div>
				<div>继续凑单></div>
			</div> -->
			<div v-for="(item, index) in FzBigList" :key="index" class="list">
				<div class="shop_title">
					{{ item.ShopTatle === "" ? "平台自营商品" : item.ShopTatle }}
				</div>


				<div v-for="(itemd,index2) in item.goodsList" :key="index2" class="list_items">
					<div v-if="itemd.name" class="activity">
						<div ref="radio" class="radio" @click="checkOnes(itemd)">
							<img :src="itemd.isSelected ? radio_on : radio" alt="">
						</div>
						<div class="name">
							{{ itemd.name }}
						</div>
					</div>
					<div v-for="(i,index) in itemd.goods" :key="i.id" class="list_item">
						<div class="top">
							<div v-show="!itemd.id||i.packageDetail" ref="radio" class="radio" @click="checkOne(i)">
								<img :src="i.isChecked ? radio_on : radio" alt="">
							</div>
							<div class="goodImg" @click="GoToShow(i)">
								<img :src="i.oSKU.cImgUrl" alt="">
							</div>
							<div v-if="i.oSKU" class="titles">
								{{ i.oSKU.productId_name }}
								<div class="psselect" style="margin-top: 1rem" v-show="!itemd.id">
									<el-select v-model="i.dlyType" size="small" placeholder="请选择"
										@visible-change="getEMS(i,$event)" @change="Courier(i)">
										<el-option v-if="i.oDeliverTypeList.length==0" :label="i.dlyTypeName"
											:value="i.dlyType" />
										<el-option v-for="oDeli in i.oDeliverTypeList" v-if="i.oDeliverTypeList.length>0"
											:key="oDeli.id" :label="oDeli.name" :value="oDeli.id" />
									</el-select>
								</div>
							</div>
							<div v-if="i.oSKU" class="skus">
								{{ i.oSKU.cSpecDescription }}
							</div>
							<div class="nums">
								<span class="add" @click="delnum(i)" v-if="!itemd.id||i.packageDetail">&lt;</span>
								{{ i.iQuantity }}
								<span class="add" @click="addnum(i)" v-if="!itemd.id||i.packageDetail"> &gt;</span>
							</div>
							<div class="price">
								<span>¥</span>
								{{ i.fNewSalePrice }}
							</div>
							<div class="ops">
								<div @click="collect(i)">
									移入收藏夹
								</div>
								<div @click="cancelOrder(i)" v-if="!itemd.id||i.packageDetail">
									删除
								</div>
							</div>
						</div>
						<div class="bottom" v-if="i.packageDetail">
								<div class="goods-item" v-for="o in i.packageDetail" :key="o.iSKUId">
									<div class="name">{{o.cProductName}}&nbsp;&nbsp;&nbsp;x{{o.iProductNum}}</div>
								</div>
						</div>
						
					</div>
				</div>
			</div>
		</div>
		<div v-if="active == 0" class="opGroup">
			<div class="leftop">
				<img :src="isChecked ? radio_on : radio" alt="" @click="checkAll">
				<span>已选({{ hasChecked }})</span>
				<span @click="cancelOrders">批量删除</span>
				<!-- <span>清空失效商品</span> -->
			</div>
			<div class="rightop">
				<div class="infos">
					<div>商品合计 : ¥{{ fTotalPrice.toFixed(2) }}</div>
					<!-- <div>已优惠 : -¥0.00</div> -->
				</div>
				<div class="priceop">
					<div>
						应付总额：
						<span>¥{{ fTotalPrice.toFixed(2) }}</span>
					</div>
					<!-- <div class="tiaoj">
            已满足免邮条件>
          </div> -->
				</div>
				<div class="payfor" @click="goPayFor">
					下单
				</div>
			</div>
		</div>

		<Like />
		<DeleteModal ref="delModal" @result="result" @refresh="getCartList" />
	</div>
</template>

<script>
	import Like from "../../components/common/carLike.vue";
	import DeleteModal from "../../components/common/deleteModal.vue";
	import radio from "../../assets/img/radio.png";
	import radio_on from "../../assets/img/radio_on.png";
	export default {
		components: {
			Like,
			DeleteModal,
		},
		// 过滤器
		filters: {
			// 去掉小时时间
			rawData(val) {
				let newDate = /\d{4}-\d{1,2}-\d{1,2}/g.exec(val);
				return newDate[0];
			},
		},
		data() {
			return {
				showModal: false,
				active: 0,
				lsCart: [],
				isChecked: false,
				radio: radio,
				radio_on: radio_on,
				hasChecked: 0,
				checkList: [],
				currentItem: {},
				fTotalPrice: 0,
				oDeliver: 0,
				oDeliverTypeList: [],
				oDeliverId: "",
				activeNames: ["1"],
				UapiActionList: [], // 去重后的店铺的优惠券集合
				ActionArr: [], // 优惠券列表
				FzBigList: [],
			};
		},
		computed: {},
		watch: {
			active: function(val) {
				console.log(val);
			},
		},
		mounted() {
			this.getCartList();
			// this.getEMSList(); // 获取商品配送方式
			// this.getNewOrder()
		},
		methods: {
			// 去掉过期购物券
			Overdue(val) {
				let Overdue = /\d{4}-\d{1,2}-\d{1,2}/g.exec(val);
				console.log("Overdue", Overdue[0]);
				// 获取当前系统时间
				let year = new Date().getFullYear();
				let month =
					new Date().getMonth() + 1 < 10 ?
					"0" + (new Date().getMonth() + 1) :
					new Date().getMonth() + 1;
				let date =
					new Date().getDate() < 10 ?
					"0" + new Date().getDate() :
					new Date().getDate();
				let TheCurrentDate = year + "-" + month + "-" + date;
				// 时间比较
				let oDate1 = new Date(Overdue[0]);
				let oDate2 = new Date(TheCurrentDate);
				if (oDate1.getTime() > oDate2.getTime()) {
					return true; //第一个大
				} else {
					return false; //第二个大
				}
			},
			//获取购物车getCartList
			getCartList() {
				this.isChecked = false;
				this.hasChecked = 0;
				this.fTotalPrice = 0;
				this.oDeliver = 0;
				let params = {
					token: localStorage.getItem("token"),
				};
				this.$api.good.getCartList(params).then((res) => {
					console.log('获取购物车列表', res.data.lsCart)
					if (res.code == 200) {
						this.goods = res.data;
						this.lsCart = res.data.lsCart;
						// 获取每个商品快递方式
						// res.data.lsCart.forEach(Element => {
						// 	let eleparams = {
						// 		token: localStorage.getItem("token"),
						// 		data: {
						// 			iShopId: Element.iShopId,
						// 			SKUId: Element.iSKUId
						// 		},
						// 	};
						// 	this.$api.good.getEMSList(eleparams).then((res) => {
						// 		console.log("配送方式", res);
						// 		if (res.data.sku.length > 0) {
						// 			this.$set(Element, 'oDeliverTypeList', res.data.sku)
						// 			// this.oDeliverTypeList = res.data.sku
						// 		} else {
						// 			this.$set(Element, 'oDeliverTypeList', res.data.Store)
						// 			// this.oDeliverTypeList = res.data.Store
						// 		}
						// 	});
						// })
						this.FiniShing(res.data.lsCart);
					}
				});
			},
			trimSpace(array) {
				for (var i = 0; i < array.length; i++) {
					if (
						array[i] == "" ||
						array[i] == null ||
						typeof array[i] === "undefined"
					) {
						array.splice(i, 1);
						i = i - 1;
					}
				}
				return array;
			},
			// 对数据进行整理
			FiniShing(FiniShing) {
				console.log("对数据进行整理", FiniShing);
				let ShopListArr = [];
				let NewShopListArr = [];
				let obj = {};
				let Arr = [];
				let arr = FiniShing;
				let map = {};
				let dest = [];
				FiniShing.forEach((item) => {
					ShopListArr.push(item.shop);
				});
				console.log("店铺列表", ShopListArr);
				// ShopListArr.splice(ShopListArr.findIndex(item => item === undefined), 1)
				ShopListArr = this.trimSpace(ShopListArr);
				console.log("ShopListArr", ShopListArr);
				// 利用对象访问属性的方法，判断对象中是否存在key
				for (var si = 0; si < ShopListArr.length; si++) {
					if (!obj[ShopListArr[si].cShopName]) {
						NewShopListArr.push(ShopListArr[si]);
						obj[ShopListArr[si].cShopName] = true;
					}
				}
				console.log("店铺数组去重", NewShopListArr);
				// 根据去重的店铺数组获取各个店铺的优惠券
				NewShopListArr.forEach((ActionItem) => {
					let data = {
						action: "mm%2Fcoupon%2Fquery",
						pager: {
							pageIndex: "1",
							pageSize: "100",
							totalPage: "",
							totalCount: "",
						},
						order: [{
							name: "create_time",
							order: "desc",
						}, ],
						conditions: [{
							name: "member_scope_id",
							value1: ActionItem.id,
							type: "string",
							op: "eq",
						}, ],
					};
					this.$api.commit.UapiAction(data).then((res) => {
						Arr.push(...res.data); // 整理所有店铺下的优惠券
						this.ActionArr = Arr;
						console.log("优惠券asas", JSON.parse(JSON.stringify(this.ActionArr)));
					});
				});
				// 对购物车添加对应商铺名称
				for (var i = 0; i < arr.length; i++) {
					this.$set(arr[i], "oDeliverTypeList", [])
					let ai = arr[i];
					let ShopTatle = "";
					if (ai.shop === undefined) {
						ShopTatle = "";
					} else {
						ShopTatle = ai.shop.cShopTag;
					}
					if (!map[ShopTatle]) {
						dest.push({
							ShopTatle: ShopTatle,
							GoodsShow: [ai],
						});
						map[ShopTatle] = ai;
					} else {
						for (var j = 0; j < dest.length; j++) {
							var dj = dest[j];
							if (dj.ShopTatle == ShopTatle) {
								dj.GoodsShow.push(ai);
								break;
							}
						}
					}
				}
				this.FzBigList = dest;
				this.carList = FiniShing;
				console.log("分组后的购物车", this.FzBigList);
				this.FzBigList.forEach(item => {
					let lPackageIds = []
					item.GoodsShow.forEach(dd => {
						if (dd.sPackageUUID) {
							lPackageIds.push(dd.sPackageUUID)
						} else {

							lPackageIds.push('')
						}

					})
					lPackageIds = [...new Set(lPackageIds)]
					console.log('lPackageIds' + lPackageIds)
					let temp = []
					lPackageIds.forEach(p => {
						let list = {
							name: "",
							price: 0,
							iQuantity: 1,
							isSelected: false,
							id: p,
							goods: []
						}
						item.GoodsShow.forEach(e => {

							if (p == e.sPackageUUID) {
								list.goods.push(e)

								list.price += e.fNewSalePrice * 1
								list.iQuantity = e.iPackageNum
								if (e.fixedSale == 1 && !e.packageDetail) {
									list.name = "固定套餐"

								} else {
									if (!e.packageDetail) {
										list.name = "搭配套餐"
									} else {

									}
								}
							} else if (p == 0 && !e.sPackageUUID) {
								console.log(e.iSKUId)
								list.goods.push(e)
								list.goods = [...new Set(list.goods)]
							}


						})

						temp.push(list)

					})
					this.$set(item, "goodsList", temp)
					console.log(item.goodsList)
				})


			},
			// 获取商品配送方式
			getEMS(item, e) {
				if (!e) {
					return
				}
				console.log("ddd")
				let params = {
					token: localStorage.getItem("token"),
					data: {
						iShopId: item.iShopId,
						SKUId: item.iSKUId
					},
				};
				this.$api.good.getEMSList(params).then((res) => {
					console.log("配送方式", res);
					// this.oDeliverTypeList = res.data.Store;

					if (res.data.sku.length > 0) {
						// this.EMSList = res.data.sku
						let temp = []
						res.data.sku.forEach(items => {
							res.data.Store.forEach(store => {
								if (items.id == store.id) {
									temp.push(store)
									this.$set(item, "oDeliverTypeList", temp)
								}
							})
						})
					} else {
						this.$set(item, "oDeliverTypeList", res.data.Store)
						// this.oDeliverTypeList = res.data.Store
					}
				})
			},
			// 去商品详情
			GoToShow(GoToShow) {
				console.log("去商品详情", GoToShow);
				this.$router.push({
					path: "/fruit/detail",
					query: {
						id: GoToShow.iProductId,
						iShopId: GoToShow.shop === undefined ? '' : GoToShow.shop.id
					},
				});
			},
			//添加到收藏夹
			collect(item) {
				console.log(item);
				let params = {
					token: localStorage.getItem("token"),
					data: {
						ids: [item.iProductId],
					},
				};
				this.$api.good.addToCollect(params).then((res) => {
					if (res.code == 200) {
						this.$message.success(res.message);
					} else {
						this.$message.error(res.message);
					}
				});
			},
			//去结算  改变状态
			goPayFor() {
				let arrList = [];
				let arrListTemp = [];
				this.lsCart.forEach((item) => {
					if (item.isChecked) {
						arrListTemp.push({
							iProductId: item.iProductId,
							iQuantity: item.iQuantity,
							iSKUId: item.iSKUId,
							id: item.id,
							dlyType: item.dlyType,
							iShopId: item.iShopId
						});
						arrList.push(item);
					}
				});
				console.log("dlyType", arrList);
				// 结算时进行分组
				let map = {};
				let ArrListdest = [];
				for (var i = 0; i < arrList.length; i++) {
					let ArrListAi = arrList[i];
					let ArrListShopTatle = "";
					if (ArrListAi.shop === undefined) {
						ArrListShopTatle = "";
					} else {
						ArrListShopTatle = ArrListAi.shop.cShopName;
					}
					// let ArrListShopTatle = ArrListAi.shop.cShopName
					if (!map[ArrListShopTatle]) {
						ArrListdest.push({
							ArrListShopTatle: ArrListShopTatle,
							GoodsShow: [ArrListAi],
						});
						map[ArrListShopTatle] = ArrListAi;
					} else {
						for (var j = 0; j < ArrListdest.length; j++) {
							var dj = ArrListdest[j];
							if (dj.ArrListShopTatle == ArrListShopTatle) {
								dj.GoodsShow.push(ArrListAi);
								break;
							}
						}
					}
				}
				arrList = ArrListdest;
				console.log("结算", arrList);
				if (arrList.length == 0) {
					this.$message.error("请选择需要结算的商品");
				} else {
					let ToCompare = [];
					arrList.forEach((item) => {
						let obj = item.GoodsShow;
						let arr = obj.map((o) => o.dlyType);
						let aaa = arr.every((el) => el === arr[0]);
						ToCompare.push(aaa);
					});
					console.log("ToCompare", ToCompare, ToCompare.includes(false));

					if (ToCompare.includes(false)) {
						this.$message.error("每个店铺下只支持一种配送方式");
					} else {
						console.log("aaa", arrList, arrListTemp);
						let params = {
							token: localStorage.getItem("token"),
							data: arrListTemp,
						};
						this.$api.good.GenerateOrderByShoppingCart(params).then((res) => {
							if (res.code == 200) {
								this.$router.push({
									path: `/confirm_order`,
								});
							} else {
								this.$message.error(res.message);
							}
						});
					}
				}
			},
			//获取结算订单信息
			getNewOrder() {
				let params = {
					token: localStorage.getItem("token"),
					data: {
						iSourceDetail: 2,
					},
				};
				this.$api.good.getNewOrder(params).then((res) => {
					if (res.code == 200) {
						console.log("获取结算订单信息", res.data);
						this.newOrder = res.data; // 总数居
						this.oDeliverTypeList = res.data.oDeliverTypeList; // 配送方式列表
						this.oDeliverId = res.data.orderDetailData.cDeliverType;
					} else {
						this.$message.error(res.message);
					}
				});
			},

			//选择配送方式
			checkoDeliver(index) {
				this.oDeliver = index;
				console.log("选择配送方式", this.oDeliverTypeList[index].id);
				this.oDeliverId = this.oDeliverTypeList[index].id;
			},
			//批量删除
			cancelOrders() {
				let arrList = [];
				this.lsCart.forEach((item) => {
					if (item.isChecked) {
						arrList.push({
							id: item.id,
							bIsMain: false,
							hvMainPt: false,
						});
					}
				});
				console.log("批量删除", arrList);
				this.currentItem = arrList;
				if (this.currentItem.length > 0) {
					this.$refs.delModal.showM("delete", "good");
					this.$refs.delModal.getItem(arrList);
				} else {
					this.$message.error("请选择需要删除的商品!");
				}
			},
			//删除商品 弹窗
			cancelOrder(item) {
				let arrList = [];
				arrList.push({
					id: item.id,
					bIsMain: false,
					hvMainPt: false,
				});
				this.$refs.delModal.showM("delete", "good");
				this.$refs.delModal.getItem(arrList);
				this.currentItem = arrList;
			},
			//关闭删除商品 弹窗
			result(e) {
				if (e) {
					let params = {
						token: localStorage.getItem("token"),
						data: {
							items: this.currentItem,
						},
					};
					this.$api.good.delCarts(params).then((res) => {
						if (res.code == 200) {
							console.log("关闭删除商品 弹窗");
							this.$message.success(res.message);
							this.hasChecked = 0;
							this.fTotalPrice = 0;
							this.isChecked = false;
							this.getCartList();
						} else {
							this.$message.error(res.message);
						}
					});
				}
			},
			//
			//下一步
			next() {
				if (this.active == 0) {
					if (this.codeSendStatus) {
						if (this.active++ > 2) this.active = 0;
					} else {
						this.$message.warning("请获取验证码");
					}
				} else if (this.active == 1) {
					if (this.codeSendStatus) {
						if (this.newPhone == "") {
							this.$message.warning("请输入手机号");
						}
						if (this.code == "") {
							this.$message.warning("请输入验证码");
						} else {
							if (this.active++ > 2) this.active = 0;
						}
					} else {
						this.$message.warning("请获取验证码");
					}
				}
			},
			//全选   取消全选
			checkAll() {
				this.isChecked = !this.isChecked;
				console.log("全选取消全选", this.isChecked);
				let totalPrice = 0;
				if (this.isChecked) {
					this.$nextTick(function() {
						this.lsCart.forEach((item) => {
							this.$set(item, "isChecked", true);
							console.log(item.fTotalPrice);
							totalPrice += item.fNewSalePrice * item.iQuantity;
						});
						this.fTotalPrice = totalPrice;
						this.hasChecked = this.lsCart.length;
						
						this.FzBigList.forEach(item => {
							item.isSelected = true
							item.goodsList.forEach(dd=>{
								dd.isSelected = true
							})
						})
					});
					
				} else {
					this.$nextTick(function() {
						this.hasChecked = 0;
						this.fTotalPrice = 0;
						this.lsCart.forEach((item) => {
							this.$set(item, "isChecked", false);
						});
						this.FzBigList.forEach(item => {
							item.isSelected = false
							item.goodsList.forEach(dd=>{
								dd.isSelected = false
							})
						})
					});
				}
			},
			//单选
			checkOne(item) {
				if(!item.packageValid){
					this.$message.error("组合销售已失效");
					return
				}
				console.log("单选", item);
				item.isChecked = !item.isChecked;
				this.$set(item, "isChecked", item.isChecked);
				if (item.isChecked) {
					this.hasChecked++;
					this.fTotalPrice += item.fNewSalePrice * item.iQuantity;
				} else {
					this.hasChecked--;
					this.fTotalPrice -= item.fNewSalePrice * item.iQuantity;
				}
				let isChecklist = [];
				this.lsCart.forEach((item) => {
					if (item.isChecked) {
						isChecklist.push(item);
					}
				});
				if (isChecklist.length == this.lsCart.length) {
					this.isChecked = true;
				} else {
					this.isChecked = false;
				}
				this.hasChecked = isChecklist.length;
			},
			checkOnes(items) {
				console.log("ddd")
				for(let a = 0;a<items.goods.length;a++){
					if(!items.goods[a].packageValid){
						this.$message.error("组合销售已失效！");
						return
					}
				}
				
				items.isSelected = !items.isSelected;
				this.$set(items, "isSelected", items.isSelected);
				items.goods.forEach(item => {
					item.isChecked = items.isSelected
					
					if (item.isChecked) {
						this.hasChecked++;
						this.fTotalPrice += item.fNewSalePrice * item.iQuantity;
					} else {
						this.hasChecked--;
						this.fTotalPrice -= item.fNewSalePrice * item.iQuantity;
					}
				})

				let isChecklist = [];
				this.lsCart.forEach((item) => {
					if (item.isChecked) {
						isChecklist.push(item);
					}
				});
				if (isChecklist.length == this.lsCart.length) {
					this.isChecked = true;
				} else {
					this.isChecked = false;
				}
				this.hasChecked = isChecklist.length;
			},
			// 更新购物车(更改配送方式)
			Courier(item) {
				console.log(item);
				let params = {
					token: localStorage.getItem("token"),
					data: {
						items: [{
							id: item.id,
							iSKUId: item.iSKUId,
							iQuantity: item.iQuantity,
							iProductId: item.iProductId,
							dlyType: item.dlyType,
						}, ],
					},
				};
				this.$api.good.update(params).then((res) => {
					if (res.code == 200) {
						console.log("更新购物车", res.data);
						this.$message.success(res.message);
						// item = res.data[0];
						this.fTotalPrice = 0;
						let isChecklist = [];
						this.lsCart.forEach((items) => {
							if (items.isChecked) {
								isChecklist.push(items);
							}
						});
						if (isChecklist.length == this.lsCart.length) {
							this.isChecked = true;
						} else {
							this.isChecked = false;
						}
						this.hasChecked = isChecklist.length;
						isChecklist.forEach((ins) => {
							this.fTotalPrice += ins.iQuantity * ins.fNewSalePrice;
						});
					} else {
						this.$message.error(res.message);
					}
				});
			},
			// 数量减少
			delnum(item) {
				
				console.log("delnum", item);
				if (item.iQuantity === 1) {
					this.$message.error("数量最少1件");
				} else {
					item.iQuantity--;
					let params = {
						token: localStorage.getItem("token"),
						data: {
							items: [{

								areaid: "",
								bIsMain: item.bIsMain,
								canPurchaseCount: "",
								deliverytype: item.dlyType,
								dlyType: item.dlyType,
								enablecustomized: false,
								hvMainPt: item.hvMainPt,
								iCorpId: item.iCorpId,
								iPackageNum: item.iPackageNum || '',
								iProductId: item.iProductId,
								iQuantity: item.iQuantity,
								iSKUId: item.iSKUId,
								iShopId: item.iShopId || '',
								iStatus: item.oSKU.iStatus,
								id: item.id,
								isFixedSale: item.fixedSale || 0,
								isSpikeMode: false,
								lInventoryCount: item.oSKU.lInventoryCount,
								lPackageId: item.lPackageId || '',
								name: item.oSKU.productId_name,
								packageValid: item.packageValid,
								productAttribute: item.productAttribute,
								realproductattribute: item.realproductattribute,
								sPackageUUID: item.sPackageUUID || '',
								singleprice: item.fNewSalePrice

							}, ],
						},
					};
					this.$api.good.update(params).then((res) => {
						if (res.code == 200) {
							this.$message.success(res.message);
							// addnum = res.data[0];
							let isChecklist = [];
							this.fTotalPrice = 0;
							this.lsCart.forEach((items) => {
								if (items.isChecked) {
									isChecklist.push(items);
								}
							});
							if (isChecklist.length == this.lsCart.length) {
								this.isChecked = true;
							} else {
								this.isChecked = false;
							}
							this.hasChecked = isChecklist.length;
							isChecklist.forEach((ins) => {
								this.fTotalPrice += ins.iQuantity * ins.fNewSalePrice;
							});
						} else {
							this.$message.error(res.message);
						}
					});
				}
			},
			// 数量增加
			addnum(item) {
				console.log("addnum", item);
				item.iQuantity++;
				let params = {
					token: localStorage.getItem("token"),
					data: {
						items: [{
							areaid: "",
							bIsMain: item.bIsMain,
							canPurchaseCount: "",
							deliverytype: item.dlyType,
							dlyType: item.dlyType,
							enablecustomized: false,
							hvMainPt: item.hvMainPt,
							iCorpId: item.iCorpId,
							iPackageNum: item.iPackageNum || '',
							iProductId: item.iProductId,
							iQuantity: item.iQuantity,
							iSKUId: item.iSKUId,
							iShopId: item.iShopId || '',
							iStatus: item.oSKU.iStatus,
							id: item.id,
							isFixedSale: item.fixedSale || 0,
							isSpikeMode: false,
							lInventoryCount: item.oSKU.lInventoryCount,
							lPackageId: item.lPackageId || '',
							name: item.oSKU.productId_name,
							packageValid: item.packageValid,
							productAttribute: item.productAttribute,
							realproductattribute: item.realproductattribute,
							sPackageUUID: item.sPackageUUID || '',
							singleprice: item.fNewSalePrice
						}, ],
					},
				};
				this.$api.good.update(params).then((res) => {
					if (res.code == 200) {
						this.$message.success(res.message);
						// addnum = res.data[0];
						let isChecklist = [];
						this.fTotalPrice = 0;
						this.lsCart.forEach((items) => {
							if (items.isChecked) {
								isChecklist.push(items);
							}
						});
						if (isChecklist.length == this.lsCart.length) {
							this.isChecked = true;
						} else {
							this.isChecked = false;
						}
						this.hasChecked = isChecklist.length;
						isChecklist.forEach((ins) => {
							this.fTotalPrice += ins.iQuantity * ins.fNewSalePrice;
						});
					} else {
						this.$message.error(res.message);
					}
				});
			},
			// 领取购物车优惠券
			ToReceive(item) {
				console.log(
					"领取优惠券",
					item,
					JSON.parse(localStorage.getItem("userInfo"))
				);
				if (JSON.parse(localStorage.getItem("userInfo")) === null) {
					this.$message.error("请先登录再领取");
				} else {
					let params = {
						action: "mm%2Fcoupon%2Freceive",
						token: localStorage.getItem("token"),
						action_type: item.type,
						coupon_id: item.id,
						mid: JSON.parse(localStorage.getItem("userInfo")).mid,
						// quantity: item.quantity,
						quantity: 1,
					};
					this.$api.commit.ToReceiveUapiAction(params).then((res) => {
						console.log("领取优惠券返回", res);
						if (res.code == 1) {
							if (res.data.length === 0) {
								this.$message.error("优惠券数量不足");
							} else {
								this.$message.success(res.msg);
							}
						} else {
							this.$message.error(res.msg);
						}
						// if (res.code == 1) {
						//   this.$message.success(res.msg);
						// } else {
						//   this.$message.error(res.msg);
						// }
					});
				}
			},
		},
	};
</script>

<style scoped lang="scss">
	.carBox {
		margin-top: 3.75rem;
		// padding: 0 16.44rem;
		display: flex;
		// justify-content: space-between;
		align-items: center;
		flex-direction: column;

		.addressInfo {
			display: flex;
			flex-direction: column;
			width: 87.31rem;
			font-size: 0.88rem;

			.initAddress {
				font-size: 0.88rem;
				color: #040000;

				img {
					width: 1.56rem;
					height: 1.25rem;
					vertical-align: middle;
				}

				span {
					padding: 0 1rem;

					&.edit {
						padding: 0.2rem 0.5rem;
						border: 0.06rem solid #7b7b7b;
					}
				}
			}

			.ads {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				padding: 2.19rem 0;

				.addinfos {
					line-height: 1.56rem;
				}

				.btns {
					display: flex;
					flex-direction: row;
					align-items: flex-end;

					.toggleAd {
						padding: 0.5rem 1.2rem;
						font-size: 0.88rem;
						color: #000;
						border: 0.06rem solid #000;
						background-color: #fff;
						margin-right: 1.5rem;
						cursor: pointer;

						&:hover {
							opacity: 0.8;
						}
					}

					.addAd {
						padding: 0.5rem 1.2rem;
						font-size: 0.88rem;
						color: #fff;
						border: 0.06rem solid #000;
						background-color: #000;
						cursor: pointer;

						&:hover {
							opacity: 0.8;
						}
					}
				}
			}
		}

		.steps {
			margin: 3.19rem auto;
			width: 48.31rem;
			display: flex;
			align-items: center;
			justify-content: center;

			.step-item {
				display: flex;
				justify-content: center;
				align-items: center;

				.line {
					display: flex;
					width: 8rem;
					height: 0.31rem;
					background: #0c0c0c;
					// background: #EF406F;
				}

				.number {
					width: 1.31rem;
					height: 1.31rem;
					background: #0c0c0c;
					// background: #EF406F;
					border-radius: 50%;
					display: inline-flex;
					justify-content: center;
					align-items: center;
					font-size: 0.75rem;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: #ffffff;
				}

				.step1 {
					position: relative;

					&::after {
						content: "1.我的购物车";
						font-size: 0.88rem;
						font-family: Microsoft YaHei;
						font-weight: 400;
						color: #333;
						position: absolute;
						top: 2rem;
						white-space: nowrap;
					}
				}

				.step2 {
					position: relative;

					&::after {
						content: "2.填写核对订单信息";
						font-size: 0.88rem;
						font-family: Microsoft YaHei;
						font-weight: 400;
						color: #333;
						position: absolute;
						top: 2rem;
						white-space: nowrap;
					}
				}

				.step3 {
					position: relative;

					&::after {
						content: "3.成功提交订单";
						font-size: 0.88rem;
						font-family: Microsoft YaHei;
						font-weight: 400;
						color: #333;
						position: absolute;
						top: 2rem;
						white-space: nowrap;
					}
				}

				&.active {
					.line {
						background: #ef406f;
					}

					.number {
						background: #ef406f;
					}

					.step1 {
						&::after {
							color: #ef406f;
						}
					}

					.step2 {
						&::after {
							color: #ef406f;
						}
					}

					.step3 {
						&::after {
							color: #ef406f;
						}
					}
				}
			}
		}

		.tableTitle {
			height: 3.13rem;
			line-height: 3.13rem;
			background: #000;
			color: #fff;
			font-size: 1rem;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			width: 87.31rem;
			margin: 0 auto 1rem auto;
			text-align: center;
		}

		.carList {
			// height: 56.19rem;
			width: 87.31rem;
			background: #fff;
			font-size: 1rem;
			margin-bottom: 1rem;

			.toper {
				padding: 1.13rem 0.94rem;
				display: flex;
				flex-direction: row;
				align-items: center;
				border-bottom: 0.06rem solid rgba(231, 231, 231, 1);
				color: #5d5d5d;

				.btns {
					padding: 0.81rem 2.56rem;
					color: #fff;
					background: #f0406f;
					margin-right: 2rem;
				}

				.btns2 {
					margin: 0 4rem;
					padding: 0.31rem 0.5rem;
					color: #f0406f;
					border: 0.06rem solid #f0406f;
				}
			}
		}

		.list {
			.shop_title {
				display: flex;
				flex-direction: row;
				align-items: center;
				padding: 1.2rem 2.06rem;
				font-size: 1rem;
				font-weight: bold;
				border-bottom: 0.1rem solid #333;
				background-color: #fbfbfb;
			}

			.list_items {
				display: flex;
				flex-direction: column;

				justify-content: center;

				.activity {
					padding: 1.2rem 2.06rem;
					display: flex;
					align-items: center;
					background-color: #fbfbfb;

					.radio {
						// margin-right: 2.13rem;
						width: 2rem;

						img {
							width: 0.8rem;
							height: 0.8rem;
						}
					}

					.name {
						font-weight: bold;
					}
				}
			}

			.list_item {
				background-color: #fff;
				display: flex;
				flex-direction: column;
				// align-items: center;
				// justify-content: space-between;
				padding: 1.2rem 2rem;
				border-bottom: 0.06rem solid rgba(231, 231, 231, 1);
				.top{
					display: flex;
					flex-direction: row;
					align-items: center;
					
				}
				.bottom{
					border-top: 0.06rem solid rgba(231, 231, 231, 1);
					padding: 1.2rem 2rem;
					display: flex;
					flex-direction: column;
					color: #999;
					font-size: 0.75rem;
					line-height: 1.5;
				}
				.radio {
					// margin-right: 2.13rem;
					width: 4rem;

					img {
						width: 0.8rem;
						height: 0.8rem;
					}
				}

				.goodImg {
					width: 10rem;
					height: 7rem;

					img {
						object-fit: contain;
						height: 7rem;
						width: 7rem;
						cursor: pointer; //鼠标变小手
					}
				}

				.titles {
					// width: 14rem;
					width: 24rem;
					line-height: 1.5rem;
					font-size: 0.88rem;
					flex-wrap: wrap;
					text-align: center;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					line-clamp: 2;
					-webkit-box-orient: vertical;
					// margin-right: 10.63rem;
				}

				.skus {
					font-size: 0.88rem;
					// margin-right: 9.94rem;
					width: 10rem;
					text-align: center;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					line-clamp: 2;
					-webkit-box-orient: vertical;
				}

				.nums {
					width: 14rem;
					font-size: 0.88rem;
					text-align: center;
					// margin-right: 8.25rem;

					.add {
						cursor: pointer;
					}
				}

				.price {
					// margin-right: 3.44rem;
					font-size: 1.5rem;
					color: #f0406f;
					width: 10rem;
					white-space: nowrap;
					text-align: center;

					span {
						font-size: 1.25rem;
					}
				}

				.ops {
					font-size: 0.88rem;
					display: flex;
					flex-direction: column;
					line-height: 1.25rem;
					width: 12rem;
					text-align: center;

					>div {
						cursor: pointer;

						&:hover {
							text-decoration: underline;
						}
					}
				}
			}
		}

		.opGroup {
			background-color: #fff;
			padding: 1.4rem 1.75rem;
			width: 83.81rem;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;

			.leftop {
				font-size: 0.88rem;
				color: #666;

				img {
					width: 0.81rem;
					height: 0.81rem;
					margin-right: 2.81rem;
					cursor: pointer;
				}

				span {
					margin-right: 2.81rem;
					cursor: pointer;

					&:hover {
						text-decoration: underline;
					}
				}
			}

			.rightop {
				display: flex;
				flex-direction: row;
				align-items: center;

				.infos {
					line-height: 1.84rem;
					color: #666;
					font-size: 0.88rem;
				}

				.priceop {
					font-size: 0.88rem;
					color: #666;
					line-height: 1.84rem;
					padding: 0 6.81rem 0 4.69rem;

					span {
						color: #f0406f;
						font-size: 1.63rem;
					}

					.tiaoj {
						font-size: 0.88rem;
					}
				}

				.payfor {
					width: 11.5rem;
					height: 3.31rem;
					background: #f0406f;
					color: #fff;
					font-size: 1.13rem;
					text-align: center;
					line-height: 3.31rem;
					cursor: pointer;

					&:hover {
						opacity: 0.8;
					}
				}
			}
		}

		.opGroups {
			background-color: #fff;
			padding: 1.4rem 1.75rem;
			width: 83.81rem;
			height: 30.31rem;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: space-between;

			.topers {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				width: 100%;
				padding-bottom: 8.56rem;
				border-bottom: 0.06rem solid rgba(235, 235, 235, 1);
			}

			.btnsGroup {
				display: flex;
				flex-direction: column;
				justify-content: center;
				width: 100%;
				text-align: right;
				padding: 1.44rem 0 0;

				.allprice {
					font-size: 1rem;
					color: #666;
					padding-bottom: 2.75rem;

					.pr {
						font-size: 1.69rem;
						color: #f0406f;
					}
				}

				.payBox {
					width: 100%;
					text-align: right;

					.payfors {
						float: right;
						width: 16.25rem;
						height: 3.25rem;
						color: #fff;
						background: rgba(240, 64, 111, 1);
						text-align: center;
						line-height: 3.25rem;
						font-size: 1.25rem;
					}
				}
			}

			.leftops {
				font-size: 0.88rem;
				color: #666;
				line-height: 1.84rem;

				>div {
					padding-bottom: 1.63rem;
				}

				img {
					width: 0.81rem;
					height: 0.81rem;
					margin-right: 0.5rem;
				}

				span {
					margin-right: 2.56rem;
					cursor: pointer;
					// &:hover {
					// 	text-decoration: underline;
					// }
				}

				.tags {
					display: flex;
					flex-direction: row;
					align-items: center;

					label {
						margin-right: 2.56rem;
						color: #666;
					}

					span {
						border: 0.06rem solid #7b7b7b;
						border-radius: 0.31rem;
						width: 4.75rem;
						height: 1.44rem;
						text-align: center;
						line-height: 1.44rem;
						color: #999;

						&.active {
							background-color: #f0406f;
							border: 0.06rem solid #f0406f;
							color: #fff;
						}
					}
				}

				.Atitle {
					display: flex;
					flex-direction: row;
					align-items: center;

					.Atitles {
						font-size: 1rem;
						color: #666;
						margin-right: 0.5rem;
					}

					.icon {
						color: #fff;
						font-size: 1rem;
						line-height: 1.31rem;
						text-align: center;
						width: 1.31rem;
						height: 1.31rem;
						background: rgba(37, 37, 37, 1);
						border-radius: 50%;
					}
				}
			}

			.rightops {
				width: 15rem;
				display: flex;
				flex-direction: column;
				line-height: 1.84rem;

				>div {
					padding-bottom: 1.94rem;
				}

				.prices {
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					color: #666;
					font-size: 1rem;
				}
			}
		}
	}

	.el-step__head.is-success {
		color: #f0406f !important;
		border-color: #f0406f !important;
	}

	.phoneBox {
		// width: 36rem;
		padding: 0 0 30rem;
		height: auto;
		margin: 0 auto;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		justify-content: center;

		.allTitle {
			color: #494949;
			font-size: 1.13rem;
			padding: 2.88rem 2.88rem 0;
		}

		.steps {
			margin: 6.3rem 0;
		}

		.tips {
			text-align: center;
			font-size: 1.13rem;
			color: #666;
		}

		.codeInput {
			width: 27.75rem;
			height: 2.8rem;
			font-size: 0.88rem;
			display: flex;
			flex-direction: row;
			margin: 2rem auto 3.81rem;

			input {
				width: 19.75rem;
				outline: none;
				height: 2.8rem;
				background: rgba(255, 255, 255, 1);
				border: 0.06px solid rgba(209, 209, 209, 1);
				text-indent: 0.94rem;
			}

			div {
				width: 8rem;
				cursor: pointer;
				height: 2.8rem;
				user-select: none;
				color: #fff;
				text-align: center;
				line-height: 2.8rem;
				background: rgba(180, 160, 120, 1);
			}
		}

		.codeInputs {
			width: 27.75rem;
			height: 2.8rem;
			font-size: 0.88rem;
			display: flex;
			flex-direction: row;
			margin: 0.5rem auto 0.5rem;

			input {
				width: 27.75rem;
				outline: none;
				height: 2.8rem;
				background: rgba(255, 255, 255, 1);
				border: 0.06px solid rgba(209, 209, 209, 1);
				text-indent: 0.94rem;
			}
		}

		.nextBtn {
			width: 24.44rem;
			height: 2.81rem;
			margin: 0 auto;
			background: rgba(0, 0, 0, 1);
			color: #fff;
			font-size: 1.13rem;
			text-align: center;
			line-height: 2.81rem;
			cursor: pointer;
			user-select: none;
		}
	}

	.coupons-box {
		background: #fff;
		margin: 0 auto;
		width: 87.31rem;

		.collapse-clas {
			padding: 0 1.13rem;
		}

		.imicon {
			margin-right: 1.13rem;
		}

		.cart-gwq-box {
			display: flex;
			align-items: center;
			flex-wrap: wrap;

			.cart-gwq-item {
				width: 22%;
				display: flex;
				align-items: center;
				border: 1px solid #ef406f;
				margin: 0.5rem;
				padding: 0.5rem;
				border-radius: 1rem;
				justify-content: space-between;
				cursor: pointer; //鼠标变小手

				.cart-lis {
					display: flex;
					width: 100%;
					justify-content: space-between;

					.text_box {
						display: flex;
						flex-direction: column;
						font-size: 1.2rem !important;
						color: #ef406f;
					}

					.title_box {
						display: flex;
						justify-content: space-between;
						align-items: center;

						.title_right {
							width: 4rem;
							height: 4rem;
							background: #ef406f;
							border-radius: 100%;
							display: flex;
							align-items: center;
							font-size: 1rem;
							justify-content: center;
							color: #fff;
						}
					}
				}
			}
		}
	}
</style>
